<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../css/index.css"/>
    <script src="../js/vue.js"></script>
    <script src="../js/index.js"></script>
</head>
<body>
<div id="app">
    <div class="block">
        <span class="demonstration">页数较少时的效果</span>
        <el-pagination
                layout="prev, pager, next"
                :total="50">
        </el-pagination>
    </div>
    <div class="block">
        <span class="demonstration">大于 7 页时的效果</span>
        <el-pagination
                layout="prev, pager, next"
                :total="1000">
        </el-pagination>
    </div>
</div>

<script>
    new Vue({
        el:'#app',
      methods:{
          handleCurrentChange(page) {
              alert(page);
          }
      }

    });
</script>
</body>
</html>